<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="../css/base.css">
    <link rel="stylesheet" href="../css/common.css">
    <link rel="stylesheet" href="../css/main.css">
    <link rel="stylesheet" href="../css/chunk.css">
    <link rel="stylesheet" href="../css/antd.css">
    <script src="../js/myswiper.js"></script>
    <script src="../js/PromiseAjax.js"></script>
    <script src="../js/searchFormater.js"></script>
    <script src="../js/jquery3.5.1.js"></script>
    <script src="../js/cookie.js"></script>
    <title>Document</title>
</head>
<body>
    <div id="__next">
        <div class="site-wrapper">
            <div class="search-bar">
                <div class="top-line"></div>
                <div class="content">
                    <img
                        src="../images/logo.png"
                        alt=""
                        class="logo-img"
                    />
                    <div class="search-bar-input">
                        <input
                            type="text"
                            placeholder="请输入商品名称"
                            value=""
                        /><span>搜索</span>
                    </div>
                    <div class="login-wrapper" style="display: flex;">
                        <div>欢迎(<span class="myInfo"></span>)</div>
                        <div style="margin-left: 20px;"><a href="../html/user/userList.html">我的购物车</a></div>
                    </div>
                </div>
            </div>
            <div class="site">
                <div class="index-wrapper">
                    <div class="index-level-3 normal">
                        <div class="index-normal-products-wrapper">
                            <div class="card-title-wrapper">
                                <div class="card-title-name">
                                    <div class="card-title-title">
                                        <div
                                            style="height: 21px;width: 4px;
                                                background-color: rgb(247,167,0);margin-right: 5px;
                                                margin-bottom: 3px;display: inline-block;vertical-align: sub;">
                                        </div>
                                        <span style="color: rgb(247, 167, 0);">精选</span>
                                    </div>
                                    <div class="card-title-desc">
                                    </div>
                                </div>
                            </div>
                            <div id="render">
                                <div class="index-normal-products-list normal">
                                    <!-- <div class="index-product-card card-type-2">
                                        <a>
                                            <img src="../images/57b7df4be2c1a71c1fbd1f14ded495b7.png" alt="" class="bottom-10"  />
                                            <div class="desc-container" >
                                                <p class="double-line-desc bottom-10">
                                                    韩国现代绞肉机全自动家用绞陷机电动多功能料理打肉机器绞菜蒜蓉
                                                </p>
                                                <div class="price-container">
                                                    <p class="after-coupon-price-type2">
                                                        <span>券后</span><span>￥39.80</span>
                                                    </p>
                                                    <span class="origin-price">原价￥49.80</span>
                                                </div>
                                            </div>
                                        </a>
                                    </div> -->
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="foot">

    </div>
    <script>
        let uid = getCookie("id") ; 
        let username = getCookie("username");
        let ulevel = getCookie("ulevel");
        console.log(uid);
        if( !uid ){
            window.location.href = '../login.html' ;
        }
        ajax({
            url:'../php/footer.php'
        }).then(res=>{
            document.querySelector(".foot").innerHTML = res ; 
        });
    </script>
    <script>
        let typeId = formatSearch(window.location.search).typeId;
        let obj = formatSearch(window.location.search);
        if( obj.typeId ){
            
        }
        console.log(formatSearch(window.location.search));
        let page = 1 ;
        let perPage = 15 ;
        ajax({
            url:'../php/index/getData.php',
            method:'post',
            dataType:'json',
            data:{
                opt:'getTypeList',
                typeId,
                page,
                perPage
            }
        }).then(res=>{
            let containerEle = document.querySelector("#render .normal");
            document.querySelector(".site .card-title-title").innerHTML = res[0]['typeName'];
            renderList(containerEle,res);
        });
        function renderList(ele,dataArr){
            ele.innerHTML = '' ;
            dataArr.forEach(item=>{
                let divEle = document.createElement("div");
                divEle.className = "index-product-card card-type-2" ;
                divEle.innerHTML = `
                    <a myid="${item['id']}">
                        <img src="../${item['showImg']}" alt="" class="bottom-10" />
                        <div class="desc-container" >
                            <p class="double-line-desc bottom-10">
                                ${item['pName']}
                            </p>
                            <div class="price-container">
                                <p class="after-coupon-price-type2">
                                    <span>券后</span><span>￥${item['price']}</span>
                                </p>
                                <span class="origin-price">原价￥${item['price']*1.3+5.5}</span>
                            </div>
                        </div>
                    </a>` ;
                divEle.querySelector("a").onclick = function (){
                    let pid = this.getAttribute("myid");
                    window.location.href = `./user/details.html?pid=${pid}` ;
                }
                ele.appendChild(divEle);
            });
        }
    </script>
</body>
</html>